/* Customized Bootstrap Styles for this template
-- Styles start with smallest (phone size) and go up to largest  
-- media queries should use min-width since we're going from smallest to largest 
*/

/* initial styles */
body {
	padding-top: 1.5em;
  	padding-bottom: 1.5em;
}

.container {
	margin-top:  0;
}

.navbar-default {
	width: 100%;
	border-bottom: none;
}

.navbar-default .navbar-nav>.active>a,
.navbar-default .navbar-nav>.active>a:hover,
.navbar-default .navbar-nav>.active>a:active {
	padding-top: 4px;
	padding-bottom: 4px;
}

.sidebar-nav .navbar li {
	font-size: 1.2em;
}

div.row.footer {
	max-width: 900px;
	margin: 0 auto;
	padding: 10px 0;
	text-align: center;
}

.container-fluid { 
		padding-right: 0;
		padding-left: 0;
		margin-right: 0;
		margin-left: 0;
	}
	
fieldset {
	min-width: 1px; /* bootstrap has it set to 0, but this is breaking the contact form */
}

/* devices 768px and larger */
@media (min-width: 768px) { 

	.container-fluid { /* remove padding for larger viewports */
		padding-right: 0;
		padding-left: 0;
		margin-right: 0;
		margin-left: 0;
	}
	
	div.row.footer {
		max-width: 94%;
		text-align: right;
	}
 
	footer {
		clear: both;
		text-align: right;
		float: none;
	  	width: 100%;
	}
	
/* make sidebar nav vertical left side */ 
  	.navbar {
		margin-right: 3px;
		border-radius: 0;
		margin-bottom: 0;
		padding-bottom: 2em;
	}
  
  	.sidebar-nav .navbar .navbar-collapse {
		padding: 0;
		padding-left: 0;
		max-height: none;
		margin-left: 0;
		width: 210px;
  	}
  
  	.sidebar-nav .navbar-header { 
		float: none; 
		margin-left: 1em;
		border-bottom: 1px solid #eee;
	}
	
  	.sidebar-nav .navbar ul {
		float: left;
  	}
  
  	.sidebar-nav .navbar li {
		float: left;
		display: block;
		margin-left: 3px;
		padding-top: 3px;
		padding-bottom: 1px;
		width: 96%;
		font-size: 1em;
  	}

  	.sidebar-nav .navbar li a {
		padding-top: 4px;
		padding-bottom: 4px;
		width: 100%;
		font-size: 1.1em;
	}
	
	.navbar-default {
		border-right: none;
		width: 98%;
	}
	
	  /* uncomment if you would like the menu to be fixed */
	  /* .navbar {
		  position: fixed;
		  width: 170px;
		  z-index: 2;
	  } */
/* END left vertical nav */
 
}

@media (min-width: 992px) {
  	.navbar {
	  	width: 210px;
  	}
  
	footer {
		float: right;
	}
	
	div.row.footer {
		max-width: 900px;
		text-align: right;
	}
	
}

@media (min-width: 1200px) {
  .navbar {
	  width: 210px;
  }
}